import echarts from 'echarts'

export function initOrderChartList(name) {
    var chartDom = document.getElementById("historyMemberChart");
    var myChart = echarts.init(chartDom);
    var option;
    option = {
      title: {
        textStyle: {
          fontSize: 16,
          fontWeight: 900,
          color: '#333'
        }
      },
      grid: {
        x: 80,
        y: 50,
        x2: 50,
        y2: 60,
        borderWidth: 0
      },
      tooltip: {
        trigger: 'axis',
        // formatter:function(){
        //   return '整天数据'+"<br>"+'交易'
        // }
      },
      xAxis: {
        type: 'category',
        boundaryGap: false,
        data: ["2点",
          "4点",
          "6点",
          "8点",
          "10点",
          "12点",
          "14点",
          "16点",
          "18点",
          "20点",
          "22点",
          "24点",],
        axisLine: {
          show: false, //是否显示x轴
          lineStyle: {
            // color: '#dbdbdb', // y坐标轴的轴线颜色
            // width: 1, //这里是坐标轴的宽度,可以去掉
          }
        },
        axisTick: {
          show: false, //是否显示刻度
        },
        // X轴的字体样式
        axisLabel: {
          show: true, //这行代码控制着坐标轴y轴的文字是否显示
          textStyle: {
            color: '#666', //X轴上的字体颜色
            fontSize: '12', // X轴字体大小

          }
        },
      },
      yAxis: {
        type: 'value',
        // y轴的颜色和宽度
        axisLine: {
          show: false, //是否显示y轴
          lineStyle: {
            // color: '#000', // y坐标轴的轴线颜色
            // width: 1, //这里是坐标轴的宽度,可以去掉
          }
        },
        axisTick: {
          show: false, //是否显示刻度
        },
        // y轴的字体样式
        axisLabel: {
          show: true, //这行代码控制着坐标轴y轴的文字是否显示
          textStyle: {
            color: '#666', //y轴上的字体颜色
            fontSize: '12' // y轴字体大小
          }
        },
      },
      series: [{
        data: [120, 110, 130, 110, 150, 210, 120, 220, 210, 250, 350, 120],
        type: 'line',
        radius: '100%',
        center: ['100%', '50%'],
        areaStyle: {},
        smooth: true,
        areaStyle: {
          color: '#d0e2f3'
        },
        label: {
          show:true,
          color:'#000'
        },
        itemStyle: {
          normal: {
            color: '#1890FF', //改变折线点的颜色
            lineStyle: {
              color: '#1890FF' //改变折线颜色
            }
          }
        },
        stack: '总量',
      }]
    };

    option && myChart.setOption(option);
  }

  export function initOrderChartList2(name) {
    var chartDom = document.getElementById("pvChart");
    var myChart = echarts.init(chartDom);
    var option;
    option = {
      title: {
        textStyle: {
          fontSize: 16,
          fontWeight: 900,
          color: '#333'
        }
      },
      grid: {
        x: 80,
        y: 50,
        x2: 50,
        y2: 60,
        borderWidth: 0
      },
      tooltip: {
        trigger: 'axis',
        // formatter:function(){
        //   return '整天数据'+"<br>"+'交易'
        // }
      },
      xAxis: {
        type: 'category',
        boundaryGap: false,
        data: ["2023-12-22","2023-12-23","2023-12-24","2023-12-25",],
        axisLine: {
          show: false, //是否显示x轴
          lineStyle: {
            // color: '#dbdbdb', // y坐标轴的轴线颜色
            // width: 1, //这里是坐标轴的宽度,可以去掉
          }
        },
        axisTick: {
          show: false, //是否显示刻度
        },
        // X轴的字体样式
        axisLabel: {
          show: true, //这行代码控制着坐标轴y轴的文字是否显示
          textStyle: {
            color: '#666', //X轴上的字体颜色
            fontSize: '12', // X轴字体大小

          }
        },
      },
      yAxis: {
        type: 'value',
        // y轴的颜色和宽度
        axisLine: {
          show: false, //是否显示y轴
          lineStyle: {
            // color: '#000', // y坐标轴的轴线颜色
            // width: 1, //这里是坐标轴的宽度,可以去掉
          }
        },
        axisTick: {
          show: false, //是否显示刻度
        },
        // y轴的字体样式
        axisLabel: {
          show: true, //这行代码控制着坐标轴y轴的文字是否显示
          textStyle: {
            color: '#666', //y轴上的字体颜色
            fontSize: '12' // y轴字体大小
          }
        },
      },
      series: [{
        data: [120, 110, 130, 110],
        type: 'line',
        radius: '100%',
        center: ['100%', '50%'],
        areaStyle: {},
        smooth: true,
        areaStyle: {
          color: '#ffaa71'
        },
        label: {
          show:true,
          color:'#000'
        },
        itemStyle: {
          normal: {
            color: '#ffaa71', //改变折线点的颜色
            lineStyle: {
              color: '#ffaa71' //改变折线颜色
            }
          }
        },
        stack: '总量',
      }]
    };

    option && myChart.setOption(option);
  }

  export function initOrderChartList3(name) {
    var chartDom = document.getElementById("orderChart");
    var myChart = echarts.init(chartDom);
    var option;
    option = {
      title: {
        textStyle: {
          fontSize: 16,
          fontWeight: 900,
          color: '#333'
        }
      },
      grid: {
        x: 80,
        y: 50,
        x2: 50,
        y2: 60,
        borderWidth: 0
      },
      tooltip: {
        trigger: 'axis',
        // formatter:function(){
        //   return '整天数据'+"<br>"+'交易'
        // }
      },
      xAxis: {
        type: 'category',
        boundaryGap: false,
        data: ["2023-12-22","2023-12-23","2023-12-24","2023-12-25",],
        axisLine: {
          show: false, //是否显示x轴
          lineStyle: {
            // color: '#dbdbdb', // y坐标轴的轴线颜色
            // width: 1, //这里是坐标轴的宽度,可以去掉
          }
        },
        axisTick: {
          show: false, //是否显示刻度
        },
        // X轴的字体样式
        axisLabel: {
          show: true, //这行代码控制着坐标轴y轴的文字是否显示
          textStyle: {
            color: '#666', //X轴上的字体颜色
            fontSize: '12', // X轴字体大小

          }
        },
      },
      yAxis: {
        type: 'value',
        // y轴的颜色和宽度
        axisLine: {
          show: false, //是否显示y轴
          lineStyle: {
            // color: '#000', // y坐标轴的轴线颜色
            // width: 1, //这里是坐标轴的宽度,可以去掉
          }
        },
        axisTick: {
          show: false, //是否显示刻度
        },
        // y轴的字体样式
        axisLabel: {
          show: true, //这行代码控制着坐标轴y轴的文字是否显示
          textStyle: {
            color: '#000', //y轴上的字体颜色
            fontSize: '12' // y轴字体大小
          }
        },
      },
      series: [{
        data: [2000, 1110, 1130, 1510],
        type: 'line',
        radius: '100%',
        center: ['100%', '50%'],
        areaStyle: {},
        smooth: true,
        areaStyle: {
          color: '#ff7171'
        },
        label: {
          color:'#000',
          show:true
        },
        itemStyle: {
          normal: {
            color: '#ff7171', //改变折线点的颜色
            lineStyle: {
              color: '#ff7171' //改变折线颜色
            }
          }
        },
        stack: '总量',
      }]
    };

    option && myChart.setOption(option);
  }